<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<script src="Js/jquery-2.1.0.js"></script>
		<script src="Js/jquery-async.js" type="text/javascript"></script>
		<script src="Js/vue.js"></script>
		<script type="text/javascript">
			$(function() {
				function success(data, textStatus, jqXHR) {
					this.jsonResult = jqXHR.responseText;
					if(this.timeout) {
						console.log("成功");
						return;
					}
					alert("成功");
				}

				async function executeAjax(options, noconfirm) {
					options.contentType = "application/json; charset=utf-8";
					if(noconfirm) {
						options.data = JSON.stringify(options.data);
						let backData = await $.ajaxAsync(options);
						success.call(this, backData.data, backData.textStatus, backData.jqXHR);
						return;
					}
					if(options.data && confirm("是否重置输入参数")) {
						this.inputData = JSON.stringify(options.data);
					} else {
						if(options.data) {
							options.data = this.inputData;
						}
						let backData = await $.ajaxAsync(options);
						success.call(this, backData.data, backData.textStatus, backData.jqXHR);
					}
				}

				var vue = new Vue({
					el: "#fun",
					data: {
						inputData: "",
						jsonResult: "",
						imgSrc: "",
						timeout: null,
						bearerToken: "",
						baseUrl: "http://47.93.173.102:8080/SXTWBIM/"
					},
					methods: {
						setToken(bearerToken) {
							let beforeSend;
							if(bearerToken) {
								beforeSend = xhr => xhr.setRequestHeader("Authorization", bearerToken);
							} else {
								beforeSend = xhr => {};
							}
							$.ajaxSetup({
								beforeSend: beforeSend
							});
						},
						async loginClick() {
							this.setToken("");
							let backData = await $.ajaxAsync(this.baseUrl + "oauth/token", {
								type: "post",
								data: {
									//username:"user_1",
									//password:"123456",
									//grant_type:"password",
									grant_type: "client_credentials",
									scope: "trust",
									client_id: "bim-client",
									client_secret: "shanxitianwei"
								}
							});
							console.log("返回结果：%o", backData.data);
							bearerToken = "Bearer " + backData.data.value;
							this.setToken(bearerToken);
						},
						stopPlay: function() {
							if(this.timeout) {
								window.clearTimeout(this.timeout);
							}
						},
						//上传环境数据
						async uploadEnvironmentData(play) {
							if(play) {
								this.timeout = setTimeout(() => this.uploadEnvironmentData(true), 1000);
							}
							let pointCodes = ["001", "002", "003"];
							let format = new Intl.DateTimeFormat("zh-CN", {
								//era:'narrow',
								year: 'numeric',
								month: '2-digit',
								day: '2-digit',
								hour: 'numeric',
								minute: 'numeric',
								second: 'numeric',
								hour12: false,
								//weekday:'long'
							});
							await executeAjax.call(this, {
								url: this.baseUrl + "api/environments",
								type: "post",
								data: {
									pointCode: pointCodes[Math.floor(Math.random() * 3)],
									timeString: format.format(new Date()),
									temperature: Math.floor(30 + Math.random() * 5),
									humidity: Math.floor(30 + Math.random() * 20),
									concentrationsOfCarbonDioxide: Math.floor(10 + Math.random() * 10),
									illuminance: Math.floor(10 + Math.random() * 10),
									airCleanliness: Math.floor(20 + Math.random() * 10)
								}
							}, play);
						},
						async getEntranceList() {
							await executeAjax.call(this, {
								url: this.baseUrl + "api/entrance-guards?floor-id=fdshgsd2gf3ds5fs66we3r2hwer12h5",
								type: "get",
							});
						},
						async saveEntrancePosition() {
							await executeAjax.call(this, {
								url: this.baseUrl + "api/entrance-guards/save-position",
								type: "put",
								data: {
									id: "4a5bc6a5c3cd42d783a39ca3b0396e54",
									modelPosition: "-15836763.076655056,-185985.84203443793,-36150.8178820528,0.908855500058217,0,0.36564321875083466,-15854380.69015112,-164390.52825156366,-18456.223917596042"
								}
							});
						},
						async getRoomById() {
							await executeAjax.call(this, {
								url: this.baseUrl + "api/rooms?id=f0489cd05475404fb2baecae2cb82b7c",
								type: "get",
							});
						},
						async saveRoomComponentId() {
							await executeAjax.call(this, {
								url: this.baseUrl + "api/rooms?field=componentId",
								type: "put",
								data: {
									id: "f0489cd05475404fb2baecae2cb82b7c",
									componentId: "abc123"
								}
							});
						},
					}
				});

			});
		</script>
	</head>

	<body>
		<div id="fun">
			<input type="button" value="登录" @click="loginClick" />
			<input type="button" value="清除定时" @click="stopPlay" />
			<input type="button" value="上传环境数据" @click="uploadEnvironmentData(false)" />
			<input type="button" value="连续上传环境数据" @click="uploadEnvironmentData(true)" />
			<input type="button" value="保存门禁位置" @click="saveEntrancePosition(false)" />
			<input type="button" value="查询门禁列表" @click="getEntranceList(false)" />
			<input type="button" value="查询单个房间" @click="getRoomById(false)" />
			<input type="button" value="保存房间标识" @click="saveRoomComponentId(false)" />
			<div style="margin: 5px;">输入：<br/><textarea style="width: 80%; height: 100px;" v-model="inputData"></textarea></div>
			<div style="margin: 5px;">输出：<br/><textarea style="width: 80%; height: 200px;">{{jsonResult}}</textarea></div>
		</div>

	</body>

</html>